<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@include file="/resources/common/commonTaglibs.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@include file="/resources/common/commonJs.jsp" %>
<%@include file="/resources/common/commonCss.jsp" %>
<title>XXX系统</title>
<style type="text/css">
.header{background-image: -moz-linear-gradient( 0deg, rgb(55,139,211) 1%, rgb(48,200,202) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(55,139,211) 1%, rgb(48,200,202) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(55,139,211) 1%, rgb(48,200,202) 100%);
  width: 100%;
  height: 10%;}
.logo_text {
  font-size: 24px;
  color: rgb(255, 255, 255);
  padding-left: 20px;
  margin-top: 1%;
  width: 40%;
  float:left;
}
.ct {
  background-image: -moz-linear-gradient( 0deg, rgb(158,1,192) 7%, rgb(1,60,182) 25%, rgb(1,171,57) 43%, rgb(252,167,4) 75%, rgb(199,15,2) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(158,1,192) 7%, rgb(1,60,182) 25%, rgb(1,171,57) 43%, rgb(252,167,4) 75%, rgb(199,15,2) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(158,1,192) 7%, rgb(1,60,182) 25%, rgb(1,171,57) 43%, rgb(252,167,4) 75%, rgb(199,15,2) 100%);
  width: 100%;
  height: 2%;
}
</style>
<script type="text/javascript">
function loginForm() {
	var userName = $('input[name="loginName"]').val();
	var pwd = $('input[name="pwd"]').val();
	var url = '${path}/userLogin';
	var args = {
			loginName: userName,
			pwd: pwd
	};
	//ajax post请求
	$.post(url, args, function(data) {
		if (data == '1') {			//学生登录
			window.location.href = '${path}/managerIndex';
		} else if (data == '2') {	//老师登录
			window.location.href = '${path}/teacherIndex';
		} else if (data == '3') {	//root 用户
			window.location.href = '${path}/managerIndex';
		} else if (data == '0') {
			$('input[name="loginName"]').css('border', '1px solid red');
		}
	}, 'json');
	return false;
}

$(function() {
	$('div:eq(0)').css({
		'height': $(window).height()
	});
})

</script>
</head>
<body>
<div>
	<div class="header">
		<div style="float: left; font-size: 24px; margin-left: 20px; margin-top: 1%; color: color: rgb(255, 255, 255);" onclick="javascript:window.location.href='/portal/leftmenu.jsp'" style="cursor: pointer;">XX大学校车调度系统</div>
		<div style="float: right; margin-top: 1%;">
			<c:if test="${empty sessionUser}">
			<form class="form-inline" action="${path }/userLogin">
				<div class="form-group">
					<label>用户名</label>
					<input type="text" class="form-control" name="loginName" placeholder="请输入用户名">
				</div>
				<div class="form-group">
					<label>密码</label>
					<input type="password" class="form-control" name="pwd" placeholder="请输入密码">
				</div>
				<button type="button" onclick="loginForm()" class="btn btn-primary">登录</button>
			</form>
			</c:if>
			<!-- 如果有用户, 显示用户信息 -->
			<c:if test="${!empty sessionUser}">
				欢迎 <a>${sessionUser.name }</a> 登录系统
			</c:if>
		</div>
	</div>
	<div class="ct"></div>
	<div style="width: 100%;height: 70%">
		<div id="myNiceCarousel" class="carousel slide" data-ride="carousel" style="width: 100%; height: 100%">
		<ol class="carousel-indicators">
		    <li data-target="#myNiceCarousel" data-slide-to="0" class="active"></li>
		    <li data-target="#myNiceCarousel" data-slide-to="1"></li>
		    <li data-target="#myNiceCarousel" data-slide-to="2"></li>
		  </ol>
		  <!-- 轮播项目 -->
		  <div class="carousel-inner">
		    <div class="item active">
		      <img alt="First slide" src="${path }/resources/images/index/index01.jpg">
		      <div class="carousel-caption">
		        <h3>我是第一张幻灯片</h3>
		      </div>
		    </div>
		    <div class="item">
		      <img alt="Second slide" src="${path }/resources/images/index/index04.jpg">
		      <div class="carousel-caption">
		        <h3>我是第二张幻灯片</h3>
		      </div>
		    </div>
		    <div class="item">
		      <img alt="Third slide" src="${path }/resources/images/index/index03.jpg">
		      <div class="carousel-caption">
		        <h3>我是第三张幻灯片</h3>
		      </div>
		    </div>
		  </div>
		  <!-- 项目切换按钮 -->
		  <a class="left carousel-control" href="#myNiceCarousel" data-slide="prev">
		    <span class="icon icon-chevron-left"></span>
		  </a>
		  <a class="right carousel-control" href="#myNiceCarousel" data-slide="next">
		    <span class="icon icon-chevron-right"></span>
		  </a>
		</div>
	</div>
</div>
</body>
</html>